<template>
  <div class="body">
    <div class="head">
      <h2>在线简历</h2>
      <div class="line"></div>
      <img src="../../src/img/神里凌人.jpg" alt="">
      <div class="lang bgc">
      <span class="name">埼玉</span>
      <p><span>18</span><span>北京</span><span>18年毕业</span></p>
      </div>
      <div class="status bgc">
        <h4>求职状态</h4>
        <span>在职-看看新机会</span>
      </div>
      <div class="advan bgc">
        <h4>个人优势</h4>
        <span>打怪兽,顺便保护地球</span>
      </div>
      <div class="position bgc">
        <h4>期望职位</h4>
        <p><span>前端工程师</span>10-15k<span></span><span>前端</span></p>
      </div>
      <div class="worker bgc">
        <h4>工作/实习经历</h4>
        <p><span><b>英雄联盟</b></span><span>2020.06.21-至今</span></p>
        <span>c级英雄</span>
        <h5>工作内容</h5>
        <p>结合页面和系统功能","结合页面和系统功能</p>
      </div>
      <div class="degree bgc">
        <h4>教育经历</h4>
        <p class="top"><span><b>英雄联盟</b></span><span>2020.06.21-至今</span></p>
        <p><span>外语</span><span>本科</span></p>
        <span><b>在校经历</b></span>
        <p class="content">结合页面和系统功能","结合页面和系统功能</p>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  mounted() {
    this.$axios
      .post("/checkuserinfo", {})
      .then((res) => {
        console.log(res);
      })
      .catch((err) => {
        console.error(err);
      });
  },
};
</script>

<style>
.body{
  background-color: #F7FFFD;
}
.bgc{
  background-color: #fff;
  margin-bottom: 15px;
  padding-top: 15px;
  padding-left: 8px;
}
.line{
    width: 80px;
    height: 4px;
    position: absolute;
    top: 115px;
    background-color: aquamarine;
}
h2{
    z-index: 999;
}
img{
  height: 60px;
  /* display: inline-block; */
  margin-top: 10px;
  border-radius: 50%;
  width: 60px;
  position: absolute;
  left: 240px;
  top: 125px;
  z-index: 999;
}

.lang{
  padding-left: 100px;
  height: 80px;
}

.lang p span{
  margin-right: 40px;
  margin-top: 10px;
}

.status{
  display: flex;
  height: 60px;
}

.status h4{
    font-weight: 550;
    margin-right: 30px;
}

.advan{
  display: flex;
  height: 60px;
}

.advan h4{
    font-weight: 550;
    margin-right: 30px;
}

.position{
  height: 80px;
}

.position h4{
  font-weight: 550;
}

.position p span{
  margin-right: 120px;
}

.worker{
  height: 200px;
}

.worker h4{
  font-weight: 550;
}

.worker p span{
  margin-right: 80px;
}

.worker h5{
  margin-top: 10px;
  font-weight: 550;
}

.degree{
  height: 180px;
}

.degree h4{
  font-weight: 550;
}

.degree .top span{
  margin-right: 100px;
}

.degree p span{
  margin-right: 60px;
}

.degree .content{
  margin-top: 15px;
}
</style>